import 'package:film/controller/auth_controller.dart';
import 'package:film/controller/film_rank_controller.dart';
import 'package:film/model/film_model.dart';
import 'package:film/screen/top_arc_border.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:html/parser.dart';

class FilmRankScreen extends StatelessWidget {
  final FilmRankController filmRankController = Get.find();
  final AuthController authController = Get.find();
  FilmRankScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('排行榜'),
        centerTitle: true,
        elevation: 0,
        flexibleSpace: Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: [Colors.lightBlue.shade300, Colors.lightBlue.shade600],
              begin: Alignment.topLeft,
              end: Alignment.bottomRight,
            ),
          ),
        ),
        bottom: TabBar(
          controller: filmRankController.tabController,
          isScrollable: true,
          tabs: filmRankController.filmTypeList
              .map(
                (item) => Tab(
                  text: item,
                  height: 20,
                ),
              )
              .toList(),
          labelColor: Colors.red,
          unselectedLabelColor: Colors.grey,
          indicatorSize: TabBarIndicatorSize.label,
          labelStyle: const TextStyle(
            fontSize: 14,
            fontWeight: FontWeight.bold,
          ),
          dividerHeight: 0,
          tabAlignment: TabAlignment.center,
          indicator: ShapeDecoration(
            shape: TopArcBorder(
              borderColor: Colors.red,
              borderWidth: 2.0,
              arcWidth: 10.0,
            ),
          ),
        ),
      ),
      body: TabBarView(
        controller: filmRankController.tabController,
        children: List.generate(
          filmRankController.filmTypeList.length,
          (index) => _buildDayListView(index),
        ),
      ),
    );
  }

  /// 构建单日番剧列表的Widget
  Widget _buildDayListView(int dayIndex) {
    return Obx(
      () => Column(
        children: [
          Expanded(
            child: ListView.builder(
              padding: const EdgeInsets.all(16.0),
              itemCount: filmRankController.rankFilmList.length,
              itemBuilder: (context, index) {
                return _buildFilmItem(filmRankController.rankFilmList[index]);
              },
            ),
          ),
          const Padding(
            padding: EdgeInsets.symmetric(vertical: 20.0),
            child: Text(
              '-- 我是有底线的 --',
              style: TextStyle(color: Colors.grey),
            ),
          ),
        ],
      ),
    );
  }

  /// 构建单个番剧项目的Widget
  Widget _buildFilmItem(Film film) {
    return GestureDetector(
      onTap: () async {
        bool isLogin = await authController.check();
        if (isLogin) {
          String url = await authController.getVideo(film.vodId!.toString(), 0);
          Get.toNamed('/film', arguments: {'url': url, 'vodId': film.vodId!.toString()});
        }
      },
      child: Padding(
        padding: const EdgeInsets.only(bottom: 20.0),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            SizedBox(
              width: 100,
              height: 140,
              child: Stack(
                fit: StackFit.expand,
                children: [
                  ClipRRect(
                    borderRadius: BorderRadius.circular(8.0),
                    child: Image.network(
                      film.vodPic ?? '',
                      fit: BoxFit.cover,
                      errorBuilder: (context, error, stackTrace) => const Icon(Icons.error),
                    ),
                  ),
                  if (film.vodRemarks != null && film.vodRemarks!.isNotEmpty)
                    Positioned(
                      bottom: 0,
                      left: 0,
                      right: 0,
                      child: Container(
                        padding: const EdgeInsets.symmetric(vertical: 3),
                        decoration: BoxDecoration(
                          color: Colors.black.withOpacity(0.6),
                          borderRadius: const BorderRadius.only(
                            bottomLeft: Radius.circular(8.0),
                            bottomRight: Radius.circular(8.0),
                          ),
                        ),
                        child: Text(
                          film.vodRemarks!,
                          style: const TextStyle(
                            color: Colors.white,
                            fontSize: 10,
                          ),
                          textAlign: TextAlign.center,
                        ),
                      ),
                    ),
                ],
              ),
            ),
            const SizedBox(width: 12),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Expanded(
                        child: Text(
                          film.vodName ?? '',
                          style: const TextStyle(
                            fontSize: 16,
                            fontWeight: FontWeight.bold,
                          ),
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                        ),
                      ),
                      const SizedBox(width: 8),
                      Container(
                        padding: const EdgeInsets.symmetric(
                          horizontal: 4,
                          vertical: 1,
                        ),
                        decoration: BoxDecoration(
                          border: Border.all(
                            color: Colors.green.shade600,
                            width: 1.5,
                          ),
                          borderRadius: BorderRadius.circular(4),
                        ),
                        child: Text(
                          '21',
                          style: TextStyle(
                            color: Colors.green.shade700,
                            fontSize: 10,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      )
                    ],
                  ),
                  const SizedBox(height: 4),
                  Text(
                    film.vodClass ?? '',
                    style: const TextStyle(
                      fontSize: 12,
                      color: Colors.grey,
                    ),
                  ),
                  const SizedBox(height: 8),
                  Text(
                    parse(film.vodContent).body?.text ?? '',
                    style: const TextStyle(
                      fontSize: 13,
                      color: Colors.black54,
                      height: 1.4,
                    ),
                    maxLines: 3,
                    overflow: TextOverflow.ellipsis,
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
